<?xml version="1.0" encoding="utf-8" standalone="no"?>
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:p="http://primefaces.org/ui"
                xmlns:f="http://java.sun.com/jsf/core"
                template="../../../layouts/100.xhtml">

<ui:define name="heading">
    <h:outputText value="Mannschaft bearbeiten"/>
</ui:define>

<ui:define name="caption">
    <p>CAPTION</p>
</ui:define>

<ui:define name="main">
<div id="main">
<div class="page_margins">
<div class="page">
<div class="inset">

<h:form id="form2">

    <p:commandButton value = "refresh" id="refresh" action="refresh" icon="ui-icon-check" disabled="false" ajax="false">
    </p:commandButton>
    w: #{wait}

    <p:media value="#{speak}" width="200" height="20" player="quicktime" rendered="#{speak != null}">
        <f:param name="autoPlay" value="true" />
    </p:media>


</h:form>
<br/>
<h:form id="form1">

<p:fieldset legend="Spieldurchfuehrung">
<p:messages/>

<h:outputText id="zeit2" value="Echte Zeit #{spielUhr.richtigeZeit}"/> - <h:outputText id="zeit3" value="Spiel Zeit: #{spielUhr.spielZeit}"/> - <h:outputText id="versp" value="Verspätung: #{business.spielzeitVerspaetung()} Sekunden"/>
<p:poll interval="1" listener="#{spielUhr.getRichtigeZeit}" update="zeit2,zeit3, versp"/>
<br/>

<br/>
<h:panelGrid columns="1" id="inputelements">

<script type="text/javascript">
    setTimeout("document.getElementById('form2:refresh').click();",#{wait});
</script>
<br/>

<p:dataTable emptyMessage="leer" id="dataTablePen" var="penalty" value="#{penaltyAnstehend}" rendered="#{!penaltyAnstehend.isEmpty()}">

    <p:column headerText="Penalty">
        <p:commandButton value="#{penalty.toString()}" disabled="true" action="notExisting">
        </p:commandButton>
    </p:column>

</p:dataTable>
<br/>

<p:accordionPanel multiple="true" activeIndex="0,1,2,3,4,5">
<p:ajax event="tabChange" listener="#{myBean.onTabChange}"/>
<p:tab title="Wartende Spiele">
    <p:dataTable emptyMessage="leer" id="dataTable1" var="zeile"
                 value="#{spielDurchfuehrung._1_wartend}">

        <p:column headerText="Start">
            <h:outputText value="#{zeile.start}">
                <f:convertDateTime type="date" pattern="HH:mm" timeZone="Europe/Zurich"/>
            </h:outputText>
        </p:column>
        <p:column>
            <f:facet name="header">Platz A
            </f:facet>
            <h:outputText value="#{zeile.a}"/>

        </p:column>
        <p:column>
            <f:facet name="header">Platz B
            </f:facet>
            <h:outputText value="#{zeile.b}"/>

        </p:column>
        <p:column>
            <f:facet name="header">Platz C
            </f:facet>
            <h:outputText value="#{zeile.c}"/>
        </p:column>

        <p:column>
            <f:facet name="header">
            </f:facet>
            <p:commandButton action="no" icon="ui-icon-check"
                             disabled="true">
            </p:commandButton>
        </p:column>
    </p:dataTable>
</p:tab>


<p:tab title="Zum vorbereiten">


    <p:dataTable emptyMessage="leer" id="dataTable2" var="zeile" value="#{spielDurchfuehrung._2_zum_vorbereiten}">

        <p:column headerText="Start">
            <h:outputText value="#{zeile.start}">
                <f:convertDateTime type="date" pattern="HH:mm" timeZone="Europe/Zurich"/>
            </h:outputText>
        </p:column>
        <p:column>
            <f:facet name="header">Platz A
            </f:facet>
            <h:outputText value="#{zeile.a}"/>

        </p:column>
        <p:column>
            <f:facet name="header">Platz B
            </f:facet>
            <h:outputText value="#{zeile.b}"/>

        </p:column>
        <p:column>
            <f:facet name="header">Platz C
            </f:facet>
            <h:outputText value="#{zeile.c}"/>
        </p:column>

        <p:column>
            <f:facet name="header">
            </f:facet>
            <p:commandButton icon="ui-icon-check"
                             disabled="#{!spielDurchfuehrung.readyToVorbereiten}"
                             action="vorbereitet">
            </p:commandButton>
        </p:column>


    </p:dataTable>
</p:tab>
<p:tab title="Wartet auf Start">
    <p:dataTable emptyMessage="leer" id="dataTable3" var="zeile"
                 value="#{spielDurchfuehrung._3_vorbereitet}">

        <p:column headerText="Start">
            <h:outputText value="#{zeile.start}">
                <f:convertDateTime type="date" pattern="HH:mm" timeZone="Europe/Zurich"/>
            </h:outputText>
        </p:column>
        <p:column>
            <f:facet name="header">Platz A
            </f:facet>
            <h:outputText value="#{zeile.a}"/>

        </p:column>
        <p:column>
            <f:facet name="header">Platz B
            </f:facet>
            <h:outputText value="#{zeile.b}"/>

        </p:column>
        <p:column>
            <f:facet name="header">Platz C
            </f:facet>
            <h:outputText value="#{zeile.c}"/>
        </p:column>

        <p:column>

            <h:outputText id="zeit3"
                          value="#{spielDurchfuehrung.countdownToStart.zeit}"/>

            <p:poll interval="1" update="zeit3"/>

        </p:column>


        <p:column>
            <f:facet name="header">
            </f:facet>
            <p:commandButton icon="ui-icon-check"
                             disabled="#{!spielDurchfuehrung.readyToSpielen}"
                             action="spielen">
            </p:commandButton>
        </p:column>

    </p:dataTable>
</p:tab>


<p:tab title="Am Spielen">
    <p:dataTable emptyMessage="leer" id="dataTable4" var="zeile" value="#{spielDurchfuehrung._4_spielend}">

        <p:column headerText="Start">
            <h:outputText value="#{zeile.start}">
                <f:convertDateTime type="date" pattern="HH:mm" timeZone="Europe/Zurich"/>
            </h:outputText>
        </p:column>

        <p:column>
            <f:facet name="header">Platz A
            </f:facet>
            <h:outputText value="#{zeile.a}"/>
        </p:column>

        <p:column>
            <f:facet name="header">Platz B
            </f:facet>
            <h:outputText value="#{zeile.b}"/>
        </p:column>

        <p:column>
            <f:facet name="header">Platz C
            </f:facet>
            <h:outputText value="#{zeile.c}"/>
        </p:column>

        <p:column>
            <h:outputText id="zeit2" value="#{spielDurchfuehrung.countdown.zeit}"/>
            <p:poll interval="1" update="zeit2"/>
        </p:column>

        <p:column>
            <f:facet name="header">
            </f:facet>
            <p:commandButton icon="ui-icon-check" ajax="false" action="beenden" disabled="#{!spieleinstellungen.abbrechenZulassen}">
            </p:commandButton>
        </p:column>

    </p:dataTable>

</p:tab>

<p:tab title="Beendet">
    <p:dataTable emptyMessage="leer" id="dataTable5" var="zeile"
                 value="#{spielDurchfuehrung._5_beendet}">

        <p:column headerText="Start">
            <h:outputText value="#{zeile.start}">
                <f:convertDateTime type="date" pattern="HH:mm" timeZone="Europe/Zurich"/>
            </h:outputText>
        </p:column>
        <p:column>
            <f:facet name="header">Platz A
            </f:facet>
            <h:outputText value="#{zeile.a}"/>

        </p:column>
        <p:column>
            <f:facet name="header">Platz B
            </f:facet>
            <h:outputText value="#{zeile.b}"/>

        </p:column>
        <p:column>
            <f:facet name="header">Platz C
            </f:facet>
            <h:outputText value="#{zeile.c}"/>
        </p:column>

    </p:dataTable>


</p:tab>

</p:accordionPanel>





</h:panelGrid>
</p:fieldset>
</h:form>


</div>
<br/>
</div>
</div>
</div>
</ui:define>

</ui:composition>
